{layout  name="public:layout" /}
<style type="text/css"> 
    .cssguycomments {background:#eee;border:#ddd;padding:8px;margin-bottom:40px;} 
    .cssguycomments p {font:normal 12px/18px verdana;} 

    table    {border-collapse:collapse;} 
    thead th { 
        font:bold 13px/18px; 
        text-align:left; 
        background:#e6e6e6; 
        color:#333; 
        padding:8px 16px 8px 8px; 
        border-right:1px solid #fff; 
        border-bottom:1px solid #fff; 
        cursor: pointer;
    } 
    thead th.null {background:#fff;} 
    tbody th { 
        font:bold 12px/15px; 
        text-align:left; 
        background:#e6e6e6; 
        color:#333; 
        padding:8px; 
        border-bottom:1px solid #f3f0e4; 
        border-right:1px solid #fff; 
        cursor: pointer;
    } 
    tbody td { 
        font:normal 12px/15px; 
        color:#333; 
        padding:8px; 
        border-right:1px solid #f3f0e4; 
        border-bottom:1px solid #f3f0e4; 
        cursor: pointer;
    } 
    /*  ��3���ǹؼ�   --cssrain.cn */ 
    tbody td.on {background:#ffcc00;}    
    thead th.on {background:#0099ff;} 
    tbody th.on {background:#0099ff;} 
</style> 
<script type="text/javascript">
    /* 
     For functions getElementsByClassName, addClassName, and removeClassName 
     Copyright Robert Nyman, <a href="http://www.robertnyman.com" target="_blank">http://www.robertnyman.com</a> 
     Free to use if this text is included 
     */
    function addLoadEvent(func) {
        var oldonload = window.onload;
        if (typeof window.onload != 'function') {
            window.onload = func;
        } else {
            window.onload = function () {
                oldonload();
                func();
            }
        }
    }

    function getElementsByClassName(className, tag, elm) {
        var testClass = new RegExp("(^|\\s)" + className + "(\\s|$)");
        var tag = tag || "*";
        var elm = elm || document;
        var elements = (tag == "*" && elm.all) ? elm.all : elm.getElementsByTagName(tag);
        var returnElements = [];
        var current;
        var length = elements.length;
        for (var i = 0; i < length; i++) {
            current = elements[i];
            if (testClass.test(current.className)) {
                returnElements.push(current);
            }
        }
        return returnElements;
    }

    function addClassName(elm, className) {
        var currentClass = elm.className;
        if (!new RegExp(("(^|\\s)" + className + "(\\s|$)"), "i").test(currentClass)) {
            elm.className = currentClass + ((currentClass.length > 0) ? " " : "") + className;
        }
        return elm.className;
    }

    function removeClassName(elm, className) {
        var classToRemove = new RegExp(("(^|\\s)" + className + "(\\s|$)"), "i");
        elm.className = elm.className.replace(classToRemove, "").replace(/^\s+|\s+$/g, "");
        return elm.className;
    }

    function makeTheTableHeadsHighlight() {
        // get all the td's in the heart of the table... 
        var table = document.getElementById('rockartists');
        var tbody = table.getElementsByTagName('tbody');
        var tbodytds = table.getElementsByTagName('td');

        // and loop through them... 
        for (var i = 0; i < tbodytds.length; i++) {

            // take note of their default class name 
            tbodytds[i].oldClassName = tbodytds[i].className;

            // when someone moves their mouse over one of those cells... 
            tbodytds[i].onmouseover = function () {

                // attach 'on' to the pointed cell 
                addClassName(this, 'on');

                // attach 'on' to the th in the thead with the same class name 
                var topheading = getElementsByClassName(this.oldClassName, 'th', table);
                addClassName(topheading[0], 'on');

                // attach 'on' to the far left th in the same row as this cell 
                var row = this.parentNode;
                var rowheading = row.getElementsByTagName('th')[0];
                addClassName(rowheading, 'on');
            }

            // ok, now when someone moves their mouse away, undo everything we just did. 

            tbodytds[i].onmouseout = function () {

                // remove 'on' from this cell 
                removeClassName(this, 'on');

                // remove 'on' from the th in the thead 
                var topheading = getElementsByClassName(this.oldClassName, 'th', table);
                removeClassName(topheading[0], 'on');

                // remove 'on' to the far left th in the same row as this cell 
                var row = this.parentNode;
                var rowheading = row.getElementsByTagName('th')[0];
                removeClassName(rowheading, 'on');
            }
        }
    }
    addLoadEvent(makeTheTableHeadsHighlight);
</script> 
<div class="content">

    <div class="header">

        <h1 class="page-title">权限管理</h1>
    </div>

    <ul class="breadcrumb">
        <li><a href="#">系统管理</a> <span class="divider">/</span></li>
        <li class="active">权限管理</li>
    </ul>

    <div class="container-fluid">
        <div class="row-fluid">

            <div class="btn-toolbar">
                <button class="btn btn-primary addnum"><i class="icon-plus"></i> {$Think.lang.tianjiaxinquanxian}</button>
                <!--                <button class="btn">Import</button>
                                <button class="btn">Export</button>-->
                <div class="btn-group">
                </div>
            </div>
            <script>
                $(".addnum").click(function () {
                    window.location.href = "{:url('/addrole')}";

                })
            </script>
            <div class="well">
                <table class="table"  id="rockartists">
                    <thead>
                        <tr>
                            <th class="null" style="width: 3%"> </th>
                            <th class="one" style="width: 7%">权限名称</th>


                            <th class="seven" style="width: 8%;">操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        {volist name="list" id="vo"}
                        <tr>
                            <th>{$key+1}</th>
                            <td class="one"><b>{$vo.r_name}</b></td>            
                            <td class="seven">
                                {if condition="$vo['r_id']==1"}
                                无法操作
                                {else/}
                                <a href="#" class="update"  data-id="{$vo.r_id}"> 修改</a> |
                                <a href="#" class="del"  data-id="{$vo.r_id}"> 删除</a> 
                                {/if}
                            </td>
                        </tr>
                        {/volist}
                    </tbody>
                    <script>
                        $(".update").on("click", function () {
                            var id = $(this).data("id");
                            window.location.href = "{:url('/updaterole')}?id=" + id;
                        })
                    </script>
                </table>
            </div>
            <div class="pagination">
                {$page}
            </div>
            <script>
                $(".del").on('click', function () {
                    var id = $(this).data("id");
                    var a = $(this).parent().parent();
                    layer.confirm("确认删除该权限吗？", {
                        btn: ['确认', '取消'] //按钮
                    }, function (index) {

                        layer.close(index);
                        $.post("{:url('Role/deleterole')}", {id: id}, function (data) {

                            if (data.status == 1)
                            {

                                layer.load(1, {
                                    shade: [0.2, '#fff'], //0.1透明度的白色背景
                                    time: 500,
                                });
                                setTimeout(function () {

                                    a.remove();

                                }, 500);
                            }




                        })


                        //            layer.msg('的确很重要', {icon: 1});
                    }, function () {

                        //            layer.msg('也可以这样', {
                        //                time: 20000, //20s后自动关闭
                        //                btn: ['明白了', '知道了']
                        //            });
                    });

                })
            </script>
            <footer>
                <hr>

                <p class="pull-right">Collect from <a href="#" title="网页模板" >sxddd</a></p>


                <p>&copy; 2019 <a href="#" >Portnine</a></p>
            </footer>

        </div>
    </div>
</div>